 <!-- 新增/查看个人复审资料 --> 
<template>
  <el-dialog
    :title="
      mode === 'add'
        ? '新增个人复审资料'
        : mode === 'edit'
        ? '修改个人复审资料'
        : '查看个人复审资料'
    "
    :visible.sync="dialogVisible"
    width="1200px"
    @close="handleClose"
    :close-on-click-modal="false"
  >
    <el-form ref="form" :model="formData" label-width="150px" :rules="rules">
      <!-- 人员基本信息 -->
      <div class="section-title">人员基本信息</div>
      <div class="section-content">
        <el-row :gutter="20">
          <!-- 第一行：作业种类 + 作业项目 -->

          <el-col :span="12">
            <el-form-item label="作业项目" prop="projectId">
              <el-cascader
                v-model="formData.projectId"
                :options="projectOptions"
                :props="{
                  checkStrictly: true,
                  emitPath: false, //只传入子节点的id
                  value: 'id',
                  label: 'label',
                  children: 'children',
                }"
                placeholder="请选择培训项目"
                style="width: 100%"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="姓名" prop="studentName">
              <el-input v-model="formData.studentName" />
            </el-form-item>
          </el-col>

          <!-- 第二行：姓名 + 手机号码 -->
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="手机号码" prop="phonenumber">
                <el-input v-model="formData.phonenumber" />
              </el-form-item>
            </el-col>
          </el-col>

          <!-- 第三行：证件类型 + 证件编号 -->
          <el-col :span="12">
            <el-form-item label="证件类型" prop="documentType">
              <el-select
                v-model="formData.documentType"
                style="width: 100%"
                placeholder="请选择证件类型"
              >
                <el-option
                  v-for="item in documentTypeOptions"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="证件编号" prop="idNumber">
              <el-input v-model="formData.idNumber" />
            </el-form-item>
          </el-col>

          <!-- 第四行：证件有效期 + 人员类型 -->
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="证件有效期" prop="validityPeriod">
                <el-date-picker
                  v-model="formData.validityPeriod"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  value-format="yyyy-MM-dd"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="人员类型" prop="userType">
                <el-select
                  v-model="formData.userType"
                  style="width: 100%"
                  placeholder="请选择人员类型"
                >
                  <el-option
                    v-for="item in userTypeOptions"
                    :key="item.dictValue"
                    :label="item.dictLabel"
                    :value="item.dictValue"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-col>

          <!-- 第五行：性别 + 出生年月 -->
          <el-col :span="12">
            <el-form-item label="性别" prop="sex">
              <el-radio-group v-model="formData.sex">
                <el-radio label="男" />
                <el-radio label="女" />
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出生年月" prop="birthDate">
              <el-date-picker
                v-model="formData.birthDate"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>

          <!-- 第六行：民族 + 职务 -->
          <el-col :span="12">
            <el-form-item label="民族" prop="nation">
              <el-select
                v-model="formData.nation"
                style="width: 100%"
                placeholder="请选择民族"
              >
                <el-option
                  v-for="item in nationOptions"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="职务" prop="position">
              <el-input v-model="formData.position" placeholder="请输入职务" />
            </el-form-item>
          </el-col>

          <!-- 第七行：学历  -->
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="学历" prop="qualification">
                <el-select
                  v-model="formData.qualification"
                  style="width: 100%"
                  placeholder="请选择学历"
                >
                  <el-option
                    v-for="item in educationOptions"
                    :key="item.dictValue"
                    :label="item.dictLabel"
                    :value="item.dictValue"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-col>

          <!-- 第八行：毕业院校 + 所学专业 -->
          <el-col :span="12">
            <el-form-item label="毕业院校" prop="graduatedFrom">
              <el-input
                v-model="formData.graduatedFrom"
                style="width: 100%"
                placeholder="请输入毕业院校"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所学专业" prop="major">
              <el-input v-model="formData.major" placeholder="请输入所学专业" />
            </el-form-item>
          </el-col>

          <!-- 第八行：毕业院校 + 地址 -->
          <el-col :span="12">
            <el-form-item label="地址" prop="address">
              <el-input
                v-model="formData.address"
                type="textarea"
                :rows="3"
                placeholder="请输入详细地址"
              />
            </el-form-item>
          </el-col>

          <!-- 第九行：邮编 + 传真 -->
          <el-col :span="12">
            <el-form-item label="邮编" prop="postCode">
              <el-input v-model="formData.postCode" placeholder="请输入邮编" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="传真" prop="fax">
              <el-input v-model="formData.fax" placeholder="请输入传真" />
            </el-form-item>
          </el-col>

          <!-- 第十行：电子邮箱 -->
          <el-col :span="12">
            <el-form-item label="电子邮箱" prop="email">
              <el-input v-model="formData.email" placeholder="请输入电子邮箱" />
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <!-- 原证书情况 -->
      <div class="section-title">原证书情况</div>
      <div class="section-content">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="原发证机关" prop="originalAuthority">
              <el-input
                v-model="formData.originalAuthority"
                placeholder="请输入原发证机关"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="证书编号" prop="originalCertificateNo">
              <el-input
                v-model="formData.originalCertificateNo"
                placeholder="请输入证书编号"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="发证机关地址" prop="originalAuthorityAddress">
              <el-input
                v-model="formData.originalAuthorityAddress"
                placeholder="请输入发证机关地址"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="首次领证日期" prop="firstIssueDate">
              <el-date-picker
                v-model="formData.firstIssueDate"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="证书到期日期" prop="expireDate">
              <el-date-picker
                v-model="formData.expireDate"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <!-- 单位信息 -->
      <div class="section-title">单位信息</div>
      <div class="section-content">
        <el-row :gutter="20">
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="单位名称" prop="unitName">
                <el-input
                  v-model="formData.unitName"
                  placeholder="请输入单位名称"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位统一信用代码" prop="socialCreditCode">
                <el-input
                  v-model="formData.socialCreditCode"
                  placeholder="请输入统一信用代码"
                />
              </el-form-item>
            </el-col>
          </el-col>
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="所属区域" prop="administrativeArea">
                <el-select
                  v-model="formData.administrativeArea"
                  style="width: 100%"
                  placeholder="请选择所属区域"
                >
                  <el-option
                    v-for="item in administrativeAreaOptions"
                    :key="item.dictValue"
                    :label="item.dictLabel"
                    :value="item.dictValue"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所在单位性质" prop="unitNature">
                <el-select
                  v-model="formData.unitNature"
                  style="width: 100%"
                  placeholder="请选择单位性质"
                >
                  <el-option
                    v-for="item in unitNatureOptions"
                    :key="item.dictValue"
                    :label="item.dictLabel"
                    :value="item.dictValue"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-col>
          <el-col :span="24">
            <el-form-item label="单位地址" prop="companyAddress">
              <el-input
                v-model="formData.companyAddress"
                placeholder="请输入单位地址"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-col :span="12">
              <el-form-item label="联系人姓名" prop="contact">
                <el-input
                  v-model="formData.contact"
                  placeholder="请输入联系人姓名"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="手机号码" prop="unitPhonenumber">
                <el-input
                  v-model="formData.unitPhonenumber"
                  placeholder="请输入手机号码"
                />
              </el-form-item>
            </el-col>
          </el-col>
        </el-row>
      </div>

      <!-- 安全管理工作经历 -->
      <div class="section-title">安全管理工作经历</div>
      <div class="section-content">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="工作时间" prop="workPeriods">
              <el-date-picker
                v-model="formData.workPeriods[0]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作企业" prop="workCompany">
              <el-input
                v-model="formData.workCompany[0]"
                placeholder="请输入单位名称，请确保信息正确"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作时间" prop="workPeriods1">
              <el-date-picker
                v-model="formData.workPeriods[1]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作企业" prop="workCompany1">
              <el-input
                v-model="formData.workCompany[1]"
                placeholder="请输入单位名称，请确保信息正确"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作时间" prop="workPeriods2">
              <el-date-picker
                v-model="formData.workPeriods[2]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作企业" prop="workCompany2">
              <el-input
                v-model="formData.workCompany[2]"
                placeholder="请输入单位名称，请确保信息正确"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <!-- 安全教育和培训情况 -->
      <div class="section-title">安全教育和培训情况</div>
      <div class="section-content">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="培训时间" prop="trainingPeriods">
              <el-date-picker
                v-model="formData.trainingPeriods[0]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="培训情况" prop="trainingSituation">
              <el-input
                v-model="formData.trainingSituation[0]"
                placeholder="请输入培训情况"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作时间" prop="trainingPeriods1">
              <el-date-picker
                v-model="formData.trainingPeriods[1]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="培训情况" prop="trainingSituation1">
              <el-input
                v-model="formData.trainingSituation[1]"
                placeholder="请输入培训情况"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作时间" prop="trainingPeriods2">
              <el-date-picker
                v-model="formData.trainingPeriods[2]"
                type="daterange"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="培训情况" prop="trainingSituation2">
              <el-input
                v-model="formData.trainingSituation[2]"
                placeholder="请输入培训情况"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <!-- 档案缺失情况 -->
      <div class="section-title">档案缺失情况</div>
      <div class="section-content">
        <el-form-item>
          <el-checkbox-group v-model="formData.recordMissing">
            <el-checkbox label="全缺" />
            <el-checkbox label="身份证" />
            <el-checkbox label="照片" />
            <el-checkbox label="申请表" />
            <el-checkbox label="学历证明" />
            <el-checkbox label="体检证明" />
            <el-checkbox label="原证书" />
            <el-checkbox label="考试检验记录" />
            <el-checkbox label="记录表" />
          </el-checkbox-group>
        </el-form-item>
      </div>

      <!-- 协议缺失情况 -->
      <div class="section-title">协议缺失情况</div>
      <div class="section-content">
        <el-form-item>
          <el-checkbox v-model="formData.protocolMissing" label="缺协议" />
        </el-form-item>
      </div>

      <!-- 备注 -->
      <div class="section-title">备注</div>
      <div class="section-content">
        <el-row :gutter="20" style="width: 100%">
          <el-col :span="24">
            <el-form-item prop="remark" label-width="0">
              <el-input
                v-model="formData.remark"
                type="textarea"
                :rows="4"
                style="
                  width: 100% !important;
                  max-width: none;
                  box-sizing: border-box;
                "
                placeholder="请输入备注"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <!-- 底部按钮 -->
      <div class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button v-if="mode !== 'view'" type="primary" @click="submitForm"
          >确定</el-button
        >
      </div>
    </el-form>
  </el-dialog>
</template>
<script>
import { projectTreeSelect } from "@/api/training/projects";
import { addPerson, updateInfo } from "@/api/training/registration";
export default {
  name: "AddPersonalReview",
  props: {
    dictData: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      dialogVisible: false,
      formData: {
        // 人员基本信息
        jobType: "",
        project: "",
        studentName: "",
        phonenumber: "",
        documentType: "IDCARD",
        idNumber: "",
        validityPeriod: [],
        userType: "",
        sex: "男",
        birthDate: "",
        nation: "",
        position: "",
        qualification: "",
        major: "",
        graduatedFrom: "",
        address: "",
        postCode: "",
        fax: "",
        email: "",

        // 原证书情况
        originalAuthority: "",
        originalCertificateNo: "",
        originalAuthorityAddress: "",
        firstIssueDate: "",
        expireDate: "",

        // 单位信息
        unitName: "",
        socialCreditCode: "",
        administrativeArea: "",
        unitNature: "",
        companyAddress: "",
        contact: "",
        unitPhonenumber: "",

        // 安全管理工作经历
        workPeriods: ["", ""], // 支持最多3条，初始化为两个空值
        workCompany: ["", ""],

        // 安全教育和培训情况
        trainingPeriods: ["", ""],
        trainingSituation: ["", ""],

        // 档案缺失情况
        recordMissing: [],
        protocolMissing: false,

        // 备注
        remark: "",

        projectId: "",
      },
      rules: {
        // 人员基本信息
        // jobType: [
        //   { required: true, message: "请选择作业种类", trigger: "change" },
        // ],
        projectId: [
          { required: true, message: "请选择作业项目", trigger: "change" },
        ],
        studentName: [
          { required: true, message: "请输入姓名", trigger: "blur" },
        ],
        phonenumber: [
          { required: true, message: "请输入手机号码", trigger: "blur" },
        ],
        documentType: [
          { required: true, message: "请选择证件类型", trigger: "change" },
        ],
        idNumber: [
          { required: true, message: "请输入证件编号", trigger: "blur" },
        ],
        sex: [{ required: true, message: "请选择性别", trigger: "change" }],
        birthDate: [
          { required: true, message: "请选择出生年月", trigger: "change" },
        ],
        address: [
          { required: true, message: "请输入详细地址", trigger: "blur" },
        ],
        postCode: [{ required: true, message: "请输入邮编", trigger: "blur" }],
        email: [{ required: true, message: "请输入电子邮箱", trigger: "blur" }],

        // 原证书情况
        originalAuthority: [
          { required: true, message: "请输入原发证机关", trigger: "blur" },
        ],
        originalCertificateNo: [
          { required: true, message: "请输入证书编号", trigger: "blur" },
        ],
        originalAuthorityAddress: [
          { required: true, message: "请输入发证机关地址", trigger: "blur" },
        ],
        firstIssueDate: [
          { required: true, message: "请选择首次领证日期", trigger: "change" },
        ],
        expireDate: [
          { required: true, message: "请选择证书到期日期", trigger: "change" },
        ],

        // 单位信息
        // unitName: [
        //   { required: true, message: "请输入单位名称", trigger: "blur" },
        // ],
        // socialCreditCode: [
        //   { required: true, message: "请输入统一信用代码", trigger: "blur" },
        // ],
        // administrativeArea: [
        //   { required: true, message: "请选择所属区域", trigger: "change" },
        // ],
        // unitNature: [
        //   { required: true, message: "请选择单位性质", trigger: "change" },
        // ],
        // companyAddress: [
        //   { required: true, message: "请输入单位地址", trigger: "blur" },
        // ],
        // contact: [
        //   { required: true, message: "请输入联系人姓名", trigger: "blur" },
        // ],
        // unitPhonenumber: [
        //   { required: true, message: "请输入手机号码", trigger: "blur" },
        // ],

        // 安全管理工作经历
        workPeriods: [
          { required: true, message: "请选择工作时间", trigger: "change" },
        ],
        workCompany: [
          { required: true, message: "请输入工作企业", trigger: "blur" },
        ],

        // 安全教育和培训情况
        trainingPeriods: [
          { required: true, message: "请选择培训时间", trigger: "change" },
        ],
        trainingSituation: [
          { required: true, message: "请输入培训情况", trigger: "blur" },
        ],

        // 备注
        remark: [],
      },
      projectOptions: [],
      queryParams: {
        projectId: "",
      },
      documentTypeOptions: [], // 证件类型选项
      unitNatureOptions: [], // 单位性质选项
      educationOptions: [], // 学历选项
      nationOptions: [], // 民族选项
      administrativeAreaOptions: [], // 所属区域选项
      userTypeOptions: [], // 人员类型选项
      mode: "add",
    };
  },
  created() {
    // this.getProjectTree();
    // this.initDictData();
  },
  watch: {
    projectName(val) {
      this.$refs.tree.filter(val);
      this.getProjectTree(val);
    },
    dictData: {
      handler(newVal) {
        if (newVal !== null) {
          this.getProjectTree();
          this.initDictData();
        }
      },
      deep: true,
    },
  },
  methods: {
    initDictData() {
      this.unitNatureOptions = this.dictData.unitNatureOptions;
      this.documentTypeOptions = this.dictData.documentTypeOptions;
      this.nationOptions = this.dictData.nationOptions;
      this.educationOptions = this.dictData.educationOptions;
      this.administrativeAreaOptions = this.dictData.administrativeAreaOptions;
      this.userTypeOptions = this.dictData.userTypeOptions;
    },
    // open(mode, data = null) {
    //   this.dialogVisible = true;
    //   this.mode = mode;

    //   if ((mode === "view" || mode === "edit") && data) {
    //     const safeData = { ...data };
    //     // 将字符串转换回数组
    //     if (typeof safeData.recordMissing === "string") {
    //       safeData.recordMissing = safeData.recordMissing
    //         .split(",")
    //         .filter((item) => item.trim() !== "");
    //     } else if (!Array.isArray(safeData.recordMissing)) {
    //       safeData.recordMissing = [];
    //     }
    //     //将结构数据转换成表单数据
    //     // 保证 workPeriods 是正确的结构
    //     // if (!Array.isArray(safeData.workPeriods)) {
    //     //   safeData.workPeriods = [[], [], []];
    //     // } else {
    //     //   while (safeData.workPeriods.length < 3) {
    //     //     safeData.workPeriods.push([]);
    //     //   }
    //     // }
    //     //工作经历
    //     if (safeData.workResume && typeof safeData.workResume === "string") {
    //       const experiences = safeData.workResume.split("; ");
    //       safeData.workPeriods = [];
    //       safeData.workCompany = [];

    //       experiences.forEach((exp, index) => {
    //         const match = exp.match(
    //           /^(\d{4}-\d{2}-\d{2})至(\d{4}-\d{2}-\d{2})，在(.+?)从事特种设备安全管理工作$/
    //         );
    //         if (match) {
    //           safeData.workPeriods[index] = [match[1], match[2]];
    //           safeData.workCompany[index] = match[3];
    //         }
    //       });

    //       // 确保长度为3
    //       while (safeData.workPeriods.length < 3) {
    //         safeData.workPeriods.push([]);
    //         safeData.workCompany.push("");
    //       }
    //     }

    //     // 保证 workCompany 存在
    //     if (!Array.isArray(safeData.workCompany)) {
    //       safeData.workCompany = ["", "", ""];
    //     } else {
    //       while (safeData.workCompany.length < 3) {
    //         safeData.workCompany.push("");
    //       }
    //     }

    //     // 同样处理 trainingPeriods 和 trainingSituation
    //     // if (!Array.isArray(safeData.trainingPeriods)) {
    //     //   safeData.trainingPeriods = [[], [], []];
    //     // } else {
    //     //   while (safeData.trainingPeriods.length < 3) {
    //     //     safeData.trainingPeriods.push([]);
    //     //   }
    //     // }

    //     // if (!Array.isArray(safeData.trainingSituation)) {
    //     //   safeData.trainingSituation = ["", "", ""];
    //     // } else {
    //     //   while (safeData.trainingSituation.length < 3) {
    //     //     safeData.trainingSituation.push("");
    //     //   }
    //     // }
    //     if (
    //       safeData.trainingExperience &&
    //       typeof safeData.trainingExperience === "string"
    //     ) {
    //       const experiences = safeData.trainingExperience.split("; ");
    //       safeData.trainingPeriods = [];
    //       safeData.trainingSituation = [];

    //       experiences.forEach((exp, index) => {
    //         const match = exp.match(
    //           /^(\d{4}-\d{2}-\d{2})至(\d{4}-\d{2}-\d{2})，培训情况：(.+)$/
    //         );
    //         if (match) {
    //           safeData.trainingPeriods[index] = [match[1], match[2]];
    //           safeData.trainingSituation[index] = match[3];
    //         }
    //       });

    //       // 确保长度为3
    //       while (safeData.trainingPeriods.length < 3) {
    //         safeData.trainingPeriods.push([]);
    //         safeData.trainingSituation.push("");
    //       }
    //     }

    //     this.formData = safeData;
    //   } else {
    //     // 重置表单
    //     this.$nextTick(() => {
    //       if (
    //         this.$refs.form &&
    //         typeof this.$refs.form.resetFields === "function"
    //       ) {
    //         this.$refs.form.resetFields();
    //       }
    //     });
    //   }
    // },
    // 获取树形数据

    open(mode, data = null) {
      this.dialogVisible = true;
      this.mode = mode;

      if ((mode === "view" || mode === "edit") && data) {
        const safeData = { ...data };

        // 处理 recordMissing
        if (typeof safeData.recordMissing === "string") {
          safeData.recordMissing = safeData.recordMissing
            .split(",")
            .filter((item) => item.trim() !== "");
        } else if (!Array.isArray(safeData.recordMissing)) {
          safeData.recordMissing = [];
        }

        // 初始化数组属性，确保它们存在
        if (!Array.isArray(safeData.workPeriods)) {
          safeData.workPeriods = [[], [], []];
        } else {
          // 确保长度为3
          while (safeData.workPeriods.length < 3) {
            safeData.workPeriods.push([]);
          }
        }

        if (!Array.isArray(safeData.workCompany)) {
          safeData.workCompany = ["", "", ""];
        } else {
          // 确保长度为3
          while (safeData.workCompany.length < 3) {
            safeData.workCompany.push("");
          }
        }

        if (!Array.isArray(safeData.trainingPeriods)) {
          safeData.trainingPeriods = [[], [], []];
        } else {
          // 确保长度为3
          while (safeData.trainingPeriods.length < 3) {
            safeData.trainingPeriods.push([]);
          }
        }

        if (!Array.isArray(safeData.trainingSituation)) {
          safeData.trainingSituation = ["", "", ""];
        } else {
          // 确保长度为3
          while (safeData.trainingSituation.length < 3) {
            safeData.trainingSituation.push("");
          }
        }

        // 处理 workResume 字符串到数组的转换
        if (safeData.workResume && typeof safeData.workResume === "string") {
          const experiences = safeData.workResume.split("; ");
          // 重置数组
          safeData.workPeriods = [[], [], []];
          safeData.workCompany = ["", "", ""];

          experiences.forEach((exp, index) => {
            if (index < 3) {
              // 确保不超过3条记录
              const match = exp.match(
                /^(\d{4}-\d{2}-\d{2})至(\d{4}-\d{2}-\d{2})，在(.+?)从事特种设备安全管理工作$/
              );
              if (match) {
                safeData.workPeriods[index] = [match[1], match[2]];
                safeData.workCompany[index] = match[3];
              }
            }
          });
        }

        // 处理 trainingExperience 字符串到数组的转换
        if (
          safeData.trainingExperience &&
          typeof safeData.trainingExperience === "string"
        ) {
          const experiences = safeData.trainingExperience.split("; ");
          // 重置数组
          safeData.trainingPeriods = [[], [], []];
          safeData.trainingSituation = ["", "", ""];

          experiences.forEach((exp, index) => {
            if (index < 3) {
              // 确保不超过3条记录
              const match = exp.match(
                /^(\d{4}-\d{2}-\d{2})至(\d{4}-\d{2}-\d{2})，培训情况：(.+)$/
              );
              if (match) {
                safeData.trainingPeriods[index] = [match[1], match[2]];
                safeData.trainingSituation[index] = match[3];
              }
            }
          });
        }

        this.formData = safeData;
      } else {
        // 重置表单
        this.$nextTick(() => {
          if (
            this.$refs.form &&
            typeof this.$refs.form.resetFields === "function"
          ) {
            this.$refs.form.resetFields();
          }
        });
      }
    },
    getProjectTree(val) {
      var params = { projectName: val };
      params.projectId = this.queryParams.projectId;
      projectTreeSelect(params).then((response) => {
        this.projectOptions = response.data;
      });
    },
    handleClose() {
      this.dialogVisible = false;
      // 重置表单
      this.$nextTick(() => {
        if (
          this.$refs.form &&
          typeof this.$refs.form.resetFields === "function"
        ) {
          this.$refs.form.resetFields();
        }
      });
    },
    submitForm() {
      if (this.mode === "view") {
        return; // 查看模式不提交
      }

      this.$refs.form.validate((valid) => {
        if (valid) {
          // 拆分证件有效期
          const [certificateStarttime, certificateEndtime] = this.formData
            .validityPeriod || [null, null];

          // 处理工作经历数据
          let workExperience = [];
          for (let i = 0; i < 3; i++) {
            const period = this.formData.workPeriods[i];
            const company = this.formData.workCompany[i];

            // 只有当时间和公司都存在时才添加
            if (
              period &&
              period.length === 2 &&
              period[0] &&
              period[1] &&
              company
            ) {
              workExperience.push({
                period: `${period[0]}至${period[1]}`,
                company: company,
              });
            }
          }
          // 处理培训经历数据
          let trainingExperience = [];
          for (let i = 0; i < 3; i++) {
            const period = this.formData.trainingPeriods[i];
            const situation = this.formData.trainingSituation[i];

            // 只有当时间和培训情况都存在时才添加
            if (
              period &&
              period.length === 2 &&
              period[0] &&
              period[1] &&
              situation
            ) {
              trainingExperience.push({
                period: `${period[0]}至${period[1]}`,
                situation: situation,
              });
            }
          }
          // 构造提交数据
          const submitData = {
            ...this.formData,
            certificateStarttime,
            certificateEndtime,
            workResume: workExperience
              .map(
                (item) =>
                  `${item.period}，在${item.company}从事特种设备安全管理工作`
              )
              .join("; "), // 使用分号分隔多条记录
            trainingExperience: trainingExperience
              .map((item) => `${item.period}，培训情况：${item.situation}`)
              .join("; "),
            trainingType: "3",
            recordMissing: this.formData.recordMissing.join(","),
          };

          // 删除原始的数组字段，因为 已经转换了格式
          delete submitData.workPeriods;
          delete submitData.workCompany;
          delete submitData.validityPeriod;

          // 提交逻辑
          console.log("提交数据:", submitData);

          if (this.mode === "add") {
            // 新增逻辑
            addPerson(submitData)
              .then((response) => {
                this.$message.success("新增成功");
                this.dialogVisible = false;
                this.$emit("submit-complete", submitData); // 触发父组件事件
              })
              .catch((error) => {
                this.$message.error("新增失败: " + error.message);
              });
          } else if (this.mode === "edit") {
            // 编辑逻辑 - 需要有 registrationId 字段
            if (!submitData.registrationId) {
              this.$message.error("缺少注册ID，无法更新数据");
              return;
            }
            updateInfo(submitData)
              .then((response) => {
                this.$message.success("修改成功");
                this.dialogVisible = false;
                this.$emit("submit-complete", submitData);
              })
              .catch((error) => {
                this.$message.error("修改失败: " + error.message);
              });
          }
        } else {
          this.$message.error("请填写完整信息");
        }
      });
      // addPerson(submitData);
      // this.$message.success("提交成功");
      // this.dialogVisible = false;
      // //  重置表单
      // this.$nextTick(() => {
      //   if (
      //     this.$refs.form &&
      //     typeof this.$refs.form.resetFields === "function"
      //   ) {
      //     this.$refs.form.resetFields();
      //   }
      // });
      // this.$emit("submit-complete", submitData); // 触发父组件事件
      //   } else {
      //     this.$message.error("请填写完整信息");
      //   }
      // });
    },
  },
};
</script>    
<style scoped>
/* 区块标题样式 */
.section-title {
  font-weight: bold;
  font-size: 20px;
  padding: 10px 0;
  margin-bottom: 10px;
}

/* 区块内容容器 */
.section-content {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  border: 1px solid #ddd;
  padding: 16px;
  background-color: #fff;
  margin-bottom: 20px;
}

/* 每个字段组（label + input） */
.field-group {
  flex: 1;
  min-width: 200px;
  display: flex;
  flex-direction: column;
}

/* 标签样式 */
.field-group label {
  font-size: 12px;
  color: #666;
  margin-bottom: 4px;
  font-weight: bold;
}

/* 输入框样式 */
.field-group .el-input,
.field-group .el-select,
.field-group .el-date-editor,
.field-group .el-radio-group {
  width: 100%;
  max-width: 300px;
}

/* 布局优化：让两列对齐 */
.section-content > .field-group:nth-child(odd) {
  margin-right: 16px;
}

/* 确保所有元素垂直对齐 */
.field-group {
  align-items: flex-start;
}

/* 调整 el-form-item 的默认样式 */
.el-form-item {
  margin-bottom: 8px;
}

/* 隐藏 el-form-item 的默认边距 */
.el-form-item__label {
  padding: 0;
  line-height: 1.2;
}

/* 精准定位“档案缺失情况”和“协议缺失情况”的 el-form-item，去除左侧空白 */
.section-title + .section-content .el-form-item {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* 可选：进一步控制 checkbox 的对齐 */
.section-content .el-checkbox-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 0;
}

.section-content .el-checkbox {
  margin-right: 8px;
}
</style>

